<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>xQuant-前台</title>
    <link rel="stylesheet" href="css/index.css"/>
</head>
<body>
<!-- 头部的盒子 -->
<header>
    <div>
        <img src="images/xQuant1_mini.png">
        <h1>中国外汇交易中心人民币市场行情</h1>
    </div>

    <div class="showTime"></div>
    <script>
        var t = null;
        var weeks = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
        // var weeks = new Array("Sun", "Mon", "Tues", "Wed", "Thur", "Fri", "Sat");
        t = setTimeout(time, 1000); //開始运行
        function time() {
            clearTimeout(t); //清除定时器
            dt = new Date();
            var y = dt.getFullYear();
            var mt = dt.getMonth() + 1;
            var day = dt.getDate();
            var h = checkTime(dt.getHours()); //获取时
            var m = checkTime(dt.getMinutes()); //获取分
            var s = checkTime(dt.getSeconds()); //获取秒
            var wi = dt.getDay(); //获取星期
            t = setTimeout(time, 1000); //设定定时器，循环运行
            document.querySelector(".showTime").innerHTML =
                y +
                "." +
                mt +
                "." +
                day +
                "   <p>" +
                weeks[wi] +
                "</p>   " +
                h +
                ":" +
                m +
                ":" +
                s;
        }
        function checkTime(i)
        {
            if (i<10)
            {i="0" + i}
            return i
        }
    </script>
</header>

<!-- 页面主体部分 -->
<section class="mainbox">
    <div class="column">
        <!-- no模块制作 -->
        <div class="no">
            <div class="no-hd">
                <!-- 加权利率（%） -->
                <ul id="dirv">
                    <li>1.9576</li>
                    <li>2.1324</li>
                    <li>2.2568</li>
                </ul>
            </div>
            <div class="no-bd">
                <ul id="dirk">
                    <!-- 交易品种 -->
                    <li>DIBO001</li>
                    <li>DIBO007</li>
                    <li>DIBO014</li>
                </ul>
            </div>
        </div>
        <div class="panel line">
            <h2>
                同行业拆解行情 <a id="t1from" href="javacript:;">2020</a><a>&nbsp;-</a><a href="javascript:;" id="t1to">2021</a>
            </h2>
            <div class="chart">图表</div>
            <div class="panel-footer"></div>
        </div>
        <div class="panel table-row">
            <h2 style="text-align: left;color:  #c7a478;">现券市场行情</h2>
            <table class="table table-hover" id="table1">
                <thead>
                <tr>
                    <th>债券简称</th>
                    <th>最新价</th>
                    <th>收益率(%)</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>21国开05</td>
                    <td>100.67</td>
                    <td>3.5850</td>
                </tr>
                <tr>
                    <td>17国开06</td>
                    <td>101.34</td>
                    <td>2.7600</td>
                </tr>
                <tr>
                    <td>21国开05</td>
                    <td>100.67</td>
                    <td>3.5850</td>
                </tr>
                <tr>
                    <td>17国开06</td>
                    <td>101.34</td>
                    <td>2.7600</td>
                </tr>
                <tr>
                    <td>21国开05</td>
                    <td>100.67</td>
                    <td>3.5850</td>
                </tr>
                <tr>
                    <td>17国开06</td>
                    <td>101.34</td>
                    <td>2.7600</td>
                </tr>
                </tbody>
            </table>
            <div class="panel-footer"></div>
        </div>


    </div>
    <div class="column">
        <!-- no模块制作 -->
        <div class="no">
            <div class="no-hd">
                <!-- 加权利率（%） -->
                <ul id="drv">
                    <li>1.9558</li>
                    <li>2.0970</li>
                    <li>2.2817</li>
                </ul>
            </div>
            <div class="no-bd">
                <ul id="drk">
                    <!-- 交易品种 -->
                    <li>DR001</li>
                    <li>DR007</li>
                    <li>DR0014</li>
                </ul>
            </div>
        </div>
        <div class="panel line2">
            <h2>
                质押式回购行情 <a id="t2from" href="javacript:;">2020</a><a>&nbsp;-</a><a id="t2to" href="javascript:;">2021</a>
            </h2>
            <div class="chart">图表</div>
            <div class="panel-footer"></div>
        </div>
        <div class="panel ">
            <h2 id="tab-time" style="text-align: right;color:  #c7a478;"></h2>
            <table id="table2">
                <!-- 6行效果最佳 -->
                <thead>
                <tr>
                    <th>债券简称</th>
                    <th>最新价</th>
                    <th>收益率(%)</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>21国开05</td>
                    <td>100.67</td>
                    <td>3.5850</td>
                </tr>
                <tr>
                    <td>17国开06</td>
                    <td>101.34</td>
                    <td>2.7600</td>
                </tr>
                <tr>
                    <td>17国开06</td>
                    <td>101.34</td>
                    <td>2.7600</td>
                </tr>
                <tr>
                    <td>17国开06</td>
                    <td>101.34</td>
                    <td>2.7600</td>
                </tr>
                <tr>
                    <td>17国开06</td>
                    <td>101.34</td>
                    <td>2.7600</td>
                </tr>
                <tr>
                    <td>17国开06</td>
                    <td>101.34</td>
                    <td>2.7600</td>
                </tr>
                </tbody>
            </table>
            <div class="panel-footer"></div>
        </div>


    </div>

</section>

<script src="js/flexible.js"></script>
<script src="js/echarts.min.js"></script>
<!-- 先引入jquery -->
<script src="js/jquery.js"></script>
<script src="js/index.js"></script>


</body>
</html>
